<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>收支统计</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="css/analysis_historyfeesummary.css" />
    <link rel="stylesheet" type="text/css" href="css/customerservicelist.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.picker.min.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.reset.css" />
    <style>
        .item-countbox{
            padding: 0px;
        }
        .categorybox .aui-row{
            padding-top: 15px;
            padding-bottom: 0px;
        }
        .list_txt span{
            border-left: none;
            padding-left: 15px;
        }
    </style>

</head>

<body>
    <div id="app" v-cloak>
        <div v-on:click="doHideSearch()" v-if="showsearch" class="maskbg">
        </div>
        <div v-if="showsearchparam" class="searchparam nomenu" style="height: 70%;">
            <div class="searchcontent" style="height: 100%;">
                <div class="searchparamtitle" v-if="companyList.length>0">
                    统计维度
                </div>
                <div class="searchparamitem" v-if="companyList.length>0">
                    <label v-on:click="doSelectProjectCompany(item.ID)" v-bind:class="{'active':form.ProjectCompanyType==item.ID}" v-for="item in projectCompanyList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle">
                    收款方式
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectChargeMoneyType(item.ID)" v-bind:class="{'active':form.ChargeMoneyTypes.indexOf(item.ID)>-1}" v-for="item in chargeMoneyTypeList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle">
                    收费项目
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectChargeCategory(item.ID)" v-bind:class="{'active':form.ChargeIDList.indexOf(item.ID)>-1}" v-for="item in chargeSummaryList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle" v-if="form.ProjectCompanyType==1">
                    项目名称
                </div>
                <div class="searchparamitem" v-if="form.ProjectCompanyType==1">
                    <label v-on:click="doSelectProject(item.ID)" v-bind:class="{'active':form.ProjectIDs.indexOf(item.ID)>-1}" v-for="item in projectList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle" v-if="form.ProjectCompanyType==2">
                    公司名称
                </div>
                <div class="searchparamitem" v-if="form.ProjectCompanyType==2">
                    <label v-on:click="doSelectCompany(item.ID)" v-bind:class="{'active':form.CompanyIDs.indexOf(item.ID)>-1}" v-for="item in companyList">{{item.Name}}</label>
                </div>
                <div class="aui_bottom" style="background: #fff; border-radius: 0px 0px 14px 14px;">
                    <div v-on:click="doReset(1)" class="aui_bottombtn left">重置</div>
                    <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
                </div>
            </div>
        </div>
        <div v-if="showsearchmonth" class="searchparam nomenu">
            <div class="searchparamtitle">
                时间
            </div>
            <div class="searchparamitem">
                <label v-bind:class="{'active':form.activeDate==1}" v-on:click="doClickDay(1)">今日</label>
                <label v-bind:class="{'active':form.activeDate==2}" v-on:click="doClickDay(2)">本月</label>
                <label v-bind:class="{'active':form.activeDate==3}" v-on:click="doClickDay(3)">本年</label>
            </div>
            <div class="searchparamtitle">
                自定义收款日期
            </div>
            <div class="searchparamitem searchparamitem_input">
                <i class="icon iconfont icon-rili"></i>
                <span class="choose new-span-date" id="startdate" data-options='{"type":"date"}' v-bind:class="{'textColorPlaceholder':form.startTime==''}">{{form.startTime==''?'开始日期':form.startTime}}</span>
                <!--<input v-on:click="do_select_time(1)" v-model="form.startTime" readonly="readonly" type="text" placeholder="开始日期">-->
                <span style="padding: 0 10px;">
                    至
                </span>
                <span class="choose new-span-date" id="enddate" data-options='{"type":"date"}' v-bind:class="{'textColorPlaceholder':form.endTime==''}">{{form.endTime==''?'结束日期':form.endTime}}</span>
                <!--<input v-on:click="do_select_time(2)" v-model="form.endTime" readonly="readonly" type="text" placeholder="结束日期">-->
            </div>
            <div class="aui_bottom">
                <div v-on:click="doReset(2)" class="aui_bottombtn left">重置</div>
                <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
            </div>
        </div>
        <div class="search_box fixedbox bgshadow" v-bind:class="{'fixedbox':showsearch}">
            <div class="searchitem" v-bind:class="{'chkedbox':showsearchparam}" v-on:click="doSelectSearchParam(1)">
                筛选
                <i v-if="!showsearchparam" class="icon iconfont icon-down"></i>
                <i v-if="showsearchparam" class="icon iconfont icon-shangjiantou" style="color:#fff;"></i>
            </div>
            <div class="searchitem" v-bind:class="{'chkedbox':showsearchmonth}" v-on:click="doSelectSearchParam(2)">
                {{form.activeDateDesc}}
                <i v-if="!showsearchmonth" class="icon iconfont icon-down"></i>
                <i v-if="showsearchmonth" class="icon iconfont icon-shangjiantou" style="color:#fff;"></i>
            </div>
        </div>
        <div class="aui-content" style="margin-top: 2.8rem;">
            <div class="list_txt"><span>{{form.startTime}} 至 {{form.endTime}} 统计</span></div>
            <div class="boxarea mainbox">
                <div class="app_list_txt">
                    <span>收款统计</span>
                    <!-- v-if="isOpenJD==false" v-on:click="do_openJD()" -->
                    <!-- <i class="icon iconfont icon-down" v-if="isOpenJD==false" v-on:click="do_openJD()" style="float: right; color: #CACED2;"></i>
                    <i class="icon iconfont icon-shangjiantou" v-if="isOpenJD==true" v-on:click="do_openJD()" style="float: right; color: #CACED2;"></i> -->
                </div>
                <!-- <div class="gd-contain mt10">
                    <div class="con-itemfl fl">
                        <div class="item-box">
                            <div class="item-name">收款金额</div>
                            <div class="item-content">{{summary.TotalCost}}</div>
                        </div>
                    </div>
                    <div class="con-itemfl  fr">
                        <div class="item-box">
                            <div class="item-name">退款金额</div>
                            <div class="item-content">{{summary.TotalBackCost}}</div>
                        </div>
                    </div>
                </div> -->
                <div>
                    <div class="gd-contain mt10  ">
                        <div class="total-countbox">
                            <div class="item-box" style="width: 92%;">
                                <div class="item-name">收款-共计{{summary.TotalCount}}笔 ({{summary.totalRoomCount}}户)</div>
                                <div class="item-content">{{summary.TotalCost}}</div>
                            </div>
                        </div>
                        <div class="item-countbox">
                            <section class="aui-grid categorybox">
                                <div class="aui-row">
                                    <div class="aui-col-xs-6" v-for="item in summary.category_list">
                                        <span>{{item.Name}}</span>
                                        <label>{{item.Cost}}</label>
                                    </div>
                                </div>
                            </section>
                        </div>
                    </div>
                </div>
            </div>
            <div class="boxarea mainbox">
                <div class="app_list_txt">
                    <span>支出统计</span>
                </div>
                <div>
                    <div class="gd-contain mt10  ">
                        <div class="total-countbox">
                            <div class="item-box" style="width: 92%;">
                                <div class="item-name">支出-共计{{summary.TotalBackCount}}笔 {{summary.totalBackRoomCount}}户</div>
                                <div class="item-content">{{summary.TotalBackCost}}</div>
                            </div>
                        </div>
                        <div class="item-countbox">
                            <section class="aui-grid categorybox">
                                <div class="aui-row">
                                    <div class="aui-col-xs-6" v-for="item in summary.return_type_list">
                                        <span>{{item.Name}}({{item.Count}}户)</span>
                                        <label>{{item.Cost}}</label>
                                    </div>
                                </div>
                            </section>
                        </div>
                    </div>
                </div>
            </div>
            <div class="boxarea mainbox">
                <div class="app_list_txt"><span>收款分析</span></div>
                <div class="chartcontainer" v-if="chargecategory_list.length>0">
                    <div id="zzcontainer" style="min-height: 260px; padding:20px 0px;"></div>
                </div>
                <div class="chartcontainer" v-if="type_list.length>0">
                    <div id="container" style="min-height: 320px; padding:20px 0px;"></div>
                </div>
                <div v-if="chargecategory_list.length<=0&&type_list.length<=0" class="nodata">暂无数据</div>
            </div>
            <div class="boxarea mainbox" v-if="summary.projectFeeList.length>0">
                <div class="app_list_txt"><span>项目统计</span></div>
                <div class="roomsummary">
                    <div class="room_itembox" v-for="item in summary.projectFeeList" v-on:click="openroom(item)">
                        <div class="room_title">
                            {{item.Name}}
                            <div class="room_right">
                                <span>{{item.TotalCost}}</span>
                                <i class="icon iconfont icon-down"></i>
                            </div>
                        </div>
                        <div class="border-btnline litile-line"></div>
                        <div class="room_item" v-if="openIDList.indexOf(item.ID)>-1">
                            <div class="room_title" v-for="item2 in item.chargeCategoryList">
                                {{item2.ChargeName}}
                                <div class="room_right">
                                    <span>{{item2.TotalCost}}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="room_itembox" v-for="item in summary.companyFeeList">
                        <div class="room_title">
                            {{item.Name}}
                            <div class="room_right">
                                <span>￥{{item.TotalCost}}</span>
                            </div>
                        </div>
                        <div class="border-btnline litile-line"></div>
                    </div>
                </div>
            </div>
            <!-- <div class="boxarea mainbox" v-if="summary.companyFeeList.length>0">
                <div class="app_list_txt"><span>分公司统计</span></div>
                <div class="roomsummary">
                    <div class="room_itembox" v-for="item in summary.companyFeeList" v-on:click="openroom(item)" >
                        <div class="room_title">
                            {{item.Name}}
                            <div class="room_right">
                                <span>{{item.TotalCost}}</span>
                                <i class="icon iconfont icon-down"></i>
                            </div>
                        </div>
                        <div class="border-btnline litile-line"></div>
                        <div class="room_item" v-if="openIDList.indexOf(item.ID)>-1">
                            <div class="room_title" v-for="item2 in item.chargeCategoryList" >
                                {{item2.ChargeName}}
                                <div class="room_right">
                                    <span>{{item2.TotalCost}}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="room_itembox"  v-for="item in summary.companyFeeList">
                        <div class="room_title">
                            {{item.Name}}
                            <div class="room_right">
                                <span>￥{{item.TotalCost}}</span>
                            </div>
                        </div>
                        <div class="border-btnline litile-line"></div>
                    </div>
                </div>
            </div> -->


        </div>
    </div>
</body>
<script type="text/javascript " src="../script/api.js "></script>
<script type="text/javascript " src="../script/vue.js "></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/mui/mui.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.picker.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.poppicker.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/page/dateRangeUtil.js"></script>
<script type="text/javascript" src="../script/highcharts/highcharts.js"></script>
<script type="text/javascript" src="../script/highcharts/modules/exporting.js"></script>
<script type="text/javascript" src="js/analysis_historyfeesummary.js"></script>

<!-- <script src="https://cdn.highcharts.com.cn/highcharts/highcharts.js"></script>
        <script src="https://cdn.highcharts.com.cn/highcharts/modules/exporting.js"></script>
        <script src="https://cdn.highcharts.com.cn/highcharts/modules/drilldown.js"></script>
        <script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script> -->

</html>
